<%@page import="java.util.Random"%>
<%@page import="com.wanmait.travel.vo.Tickit"%>
<%@page import="com.wanmait.travel.vo.ScenicTickitType"%>
<%@page import="java.util.List"%>
<%@page import="com.wanmait.travel.vo.Scenic"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%
    String path=request.getServletContext().getContextPath();
    %>
    <jsp:include page="/inc/header.jsp"></jsp:include>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>景点展示</title>
	</head>
	<body>
<%ScenicTickitType stt=(ScenicTickitType)request.getAttribute("stt") ;%>
	<%Scenic scenic=stt.getScenic(); %>
	<% Tickit tickitChild=stt.getTickitChild();%>
	<% Tickit tickitMan=stt.getTickitMan();%>
	<% Tickit tickitOld=stt.getTickitOld();%>
		<div class="header" >
		<input type="hidden" value="<%=scenic.getId() %>"  id="sId">
			<%=scenic.getName()%>
			<div style="float: right;">
			<%
			if(request.getSession().getAttribute("userinfo")!=null)
			{
				
			
			%>
			
			
			
			
			
			<a id=collection>收藏</a>
			<%}else{%>
			
			<a id=collections>收藏</a>
			
			
			<%} %>
			<a>分享</a>
			评分:<%=scenic.getAnding() %>
			</div>
		</div>
		<div class="main">
		
		
		
		
		
		
		<div class="buycar">
		<%
	    if(tickitChild!=null) 
	    {
	    %>
			<div class="tickit_a">
			<%=scenic.getName()%>&nbsp&nbsp&nbsp&nbsp<%=tickitChild.getTickitType().getType()%>&nbsp<br>票价<%=tickitChild.getPrice()%>元
			&nbsp数量：<span id="tcNum"><%=tickitChild.getNum() %></span>张
			<div>
			在线支付&nbsp&nbsp
			
			<input type="button" value="+"   onclick="tcAdd()" style="width:30px">
			<input type="text" value="0" style="width:30px" id="tcValue" onfocus="tc()" onblur="tcb()">
			<input type="button" value="-"  onclick="tcDiff()" style="width:30px">
			</div>
			</div>
		<%} %>
			
		
			
		<%
	    if(tickitOld!=null) 
	    {
	    %>
			<div class="tickit_a">
			<%=scenic.getName()%>&nbsp&nbsp&nbsp&nbsp<%=tickitOld.getTickitType().getType()%>&nbsp<br>票价<%=tickitOld.getPrice()%>元
			&nbsp数量：<span id="toNum"><%=tickitOld.getNum() %></span>张
			<div>
			在线支付&nbsp&nbsp
			
			<input type="button" value="+"  onclick="toAdd()" style="width:30px">
			<input type="text" value="0" style="width:30px" id="toValue"  onfocus="to()" onblur="tob()">
			<input type="button" value="-"  onclick="toDiff()" style="width:30px">
			</div>
			</div>
		<%} %>
		
		
		
		<%
	    if(tickitMan!=null) 
	    {
	    %>
			<div class="tickit_a">
			<%=scenic.getName()%>&nbsp&nbsp&nbsp&nbsp<%=tickitMan.getTickitType().getType()%>&nbsp<br>票价:<%=tickitMan.getPrice() %>元
			&nbsp数量：<span id="tmNum"><%=tickitMan.getNum() %></span>张
			<div>
			在线支付&nbsp&nbsp
			
			<input type="button" value="+" onclick="tmAdd()" style="width:30px">
			<input type="text" value="0" style="width:30px" id="tmValue" onfocus="tm()" onblur="tmb()">
			<input type="button" value="-" onclick="tmDiff()" style="width:30px">
			</div>
			</div>
		<%} %>
		
			<input type="button" value="在线预定"  id="reserve" onclick="reserve()" style="width:100px">
			</div>
			
		
			
			
			
			
			
			<div class="showPic">
			 <img  id="pic" src="/Travel/image/海水浴场.jpg">  
			<ul id="numUl">     
           </ul>
			
			</div>
			</div>
		<div class="box_a">
			<img  class="jpg" src="/Travel/image/个性描述.jpg">
			<%=scenic.getIntro() %>
		</div>
		<div class="box">
			<img  class="jpg" src="/Travel/image/内部情况.jpg">
			开放时间:<%=scenic.getOpenTime() %>
			关闭时间:<%=scenic.getCloseTime() %>
			以及有什么设施
		</div>
		<div class="box_a">
			<img  class="jpg" src="/Travel/image/交通情况.jpg">
			<%=scenic.getLocation() %>
			包括附近的车站地铁站等等
		</div>
		<div class="box">
			<img   class="jpg"src="/Travel/image/周边情况.jpg">
			涵盖附近有什么吃的住的
		</div>
		<div style="margin-left:250px;">
			<input type="button" value="查看评论"  onclick="refreshComment()"style="width:100px;">
	
		<ul id="comments">
		
		</ul>
		
				<input type="hidden" id="scenicid" value="<%=scenic.getId()%>">
				
					<textarea id="comment"  rows="10" cols="60" placeholder="留言内容"></textarea><br>
				
				
					<input type="button" value="发布留言" id="addComment" style="width:100px;">
				</div>
				<%
				if(request.getSession().getAttribute("userinfo")!=null)
				{
				%>
				<div style=" height:130px; width:300px;margin-left:660px;margin-top:-200px;">
				评分：
		     <ul style="list-style: none;" >
             <li style="float: left;font-size: 39px;color: yellow;" data-id="1" id=anding>☆</li>
            <li style="float: left;font-size: 39px;color: yellow;"  data-id="2" id=anding>☆</li>
            <li style="float: left;font-size: 39px;color: yellow;" data-id="3" id=anding>☆</li>
            <li style="float: left;font-size: 39px;color: yellow;" data-id="4" id=anding>☆</li>
            <li style="float: left;font-size: 39px;color: yellow;" data-id="5" id=anding>☆</li>
           </ul>
		</div>
				<%}else{%>
				<div style=" height:130px; width:300px;margin-left:660px;margin-top:-200px;">
				评分：请登录
				</div>
				<%} %>
				
	</body>
</html>
 <script type="text/javascript">
 $(function(){
	 $("#collections").click(function(){
		 alert("请登录")
	 });
 });
 $(function(){
	 $("#collection").click(function(){
		 var action="<%=path%>/UserinfoController?action=addCollection";
		 var scenicid=<%=scenic.getId()%>;
		 $.post(action,{scenicid:scenicid},function(mes){
			 alert("收藏成功");
		 });
	 });
 });
 

             $(function(){
                $("li").mouseover(function(){
                     $(this).text("★").prevAll().text("★");
                 }).mouseout(function(){
                    $(this).text("☆").siblings().text("☆");
                    $("li[index=1]").text("★").prevAll().text("★");
                 }).click(function(){
                     $(this).attr("index",1).siblings().removeAttr();
                     var action="/Travel/CommentController?action=anding";
                     var scenicid =<%=scenic.getId()%>;
                     var anding=$(this).data("id");
                   $.post(action,{scenicid:scenicid,anding:anding} ,function(mes){
                	   alert("感谢您的评分")
                		   } );
                });
             });       
             </script>
<script src="<%=path %>/js/scenicShow.js?<%=new Random().nextInt()%>" type="text/javascript"></script> 
<script type="text/javascript" src="/Travel/js/jquery-3.3.1.min.js"></script>
<link href="/Travel/css/css_a.css?<%=new Random(). nextInt()%>" type="text/css" rel="stylesheet">

<script>

function refreshComment(){
	var pid="/Travel/CommentController?action=listComment&scenicid="+<%=scenic.getId() %>;
	$.get(pid, function(mes){
		$("#comment").val("");
		$("#comments").html(mes);
	});
}
	
	
	
$(function(){

	$("#addComment").click(function(){
		
		var action ="/Travel/CommentController?action=add";
		
		var scenicid =<%=scenic.getId()%>;
		
		var info =$("#comment").val();
		
		$.post(action,{scenicid:scenicid,comment:info},function(mes){
			
			 refreshComment(); 
			if(mes=="1")
				{
				alert("请登录")
				}
		});
	});
	
});



</script>

        <script type="text/javascript">
            var pics = ["中联广场.jpg","避暑山庄.jpg","八大关.jpg","zhanqiao.jpg","54广场.jpg"];//pics数组中间存放的是所有的文件名
            //根据pics数组中间元素的个数  往ul中间添加li
            function addNum()
            {
                var numUl = $("#numUl");//获得ul对象
                
                for(var i=0;i<pics.length;i++)//pics.length是数组元素的个数  数组有几个元素  就循环多少次
                {
                    var li = $("<li></li>");//创建li对象
                    numUl.append(li);//将新创建的li 添加到ul中间
                    li.html(i+1);//设置li中间的数字
                }
            }
            
            $(document).ready(addNum);//网页加载结束  调用addNum方法
        </script>
        
        <script type="text/javascript">
            //设置ul的位置
            function setUllocation()
            {
                //设置ul的margin-top  margin-left
                var numUl = $("#numUl");//获得ul的对象
                
                var top = 200-20;
                var left = 400-20*pics.length;
                
                numUl.css("margin-top",top);//设置margin-top
                numUl.css("margin-left",left);//设置margin-left的值
            }
            
            $(document).ready(setUllocation);
        </script>
        
        <script type="text/javascript">
            //切换图片
            var st;//存放计时的对象
            var index = 0;//pics数组的元素的下标
            function changePic()
            {
                var pic = $("#pic");//获得pic对象
                
                pic.attr("src","/Travel/image/"+pics[index])//设置src属性的值
                
                index++;//下标+1  换下一张图片
                
                if(index==pics.length)//数组下标已经越界
                {
                    index = 0;//图片从第一张重新开始
                }
                
                st = setTimeout("changePic()",3000);
            }
            
            $(document).ready(changePic);
        </script>
        
        <script type="text/javascript">
            
            function addEventForLi()
            {
                var showPic = $(".showPic");
                
                var lis = showPic.find("li");
                
                lis.mouseover(liEvent);
                
                lis.mouseout(liMouseOut);
                
            }
            
            $(document).ready(addEventForLi);
           
        </script>
        
        <script type="text/javascript">
            
            function liEvent()
            {
                var li = $(this);
        
                var strNum = li.html();
                
                var num = parseInt(strNum);
                
                var pic = $("#pic");
                
                pic.attr("src","/Travel/image/"+pics[num-1]);//更改图片
                
                clearTimeout(st);//停止切换
            }
        </script>
        
        <script type="text/javascript">
        //li鼠标离开的事件
        function liMouseOut()
        {
            changePic();
        }
        </script>
      <script type="text/javascript" src="//js.users.51.la/20136763.js"></script>